<template>
    <div class="con">
        <div class="left">
            <div style="height: 26px;">
                <h1 style="margin-left: 20px;line-height: 26px;display: flex;">
                    <HomeFilled style="width: 25px;height: 25px;"></HomeFilled> / 会员中心
                </h1>
            </div>

            <el-menu :default-active="defRea" class="el-menu-vertical-demo">
                <el-menu-item index="/user/real" @click="openPath('/user/real')">
                    <el-icon>
                        <Postcard></Postcard>
                    </el-icon>
                    <span>实名认证</span>
                </el-menu-item>
                <el-menu-item index="/user/order" @click="openPath('/user/order')">
                    <el-icon>
                        <Notebook></Notebook>
                    </el-icon>
                    <span>挂号订单</span>
                </el-menu-item>
                <el-menu-item index="/user/visitor" @click="openPath('/user/visitor')">
                    <el-icon>
                        <setting />
                    </el-icon>
                    <span>就诊人管理</span>
                </el-menu-item>
                <el-menu-item index="/user/account" @click="openPath('/user/account')">
                    <el-icon>
                        <setting />
                    </el-icon>
                    <span>账号信息</span>
                </el-menu-item>
                <el-menu-item index="/user/opinion" @click="openPath('/user/opinion')">
                    <el-icon>
                        <ChatDotRound></ChatDotRound>
                    </el-icon>
                    <span>意见反馈</span>
                </el-menu-item>
            </el-menu>
        </div>
        <div class="right">
            <router-view></router-view>
        </div>
    </div>
</template>

<script setup lang="ts">
import { onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router'

let $route = useRoute()
let $router = useRouter()


// 进入页面的默认路径
let defRea = $route.path
// 进入页面后获取query
let enterId = $route.query.id

const openPath = (key: any) => {

    $router.push({
        path: key,
        query: {
            id: enterId
        }
    })
}



</script>

<style scoped lang="scss">
.con {
    display: flex;
    border-top: 1px solid #ccc;

    .left {
        width: 200px;
        min-height: 200px;

    }

    .right {
        width: 1000px;
        min-height: 200px;
    }
}
</style>